

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class ButtonWidget extends StatelessWidget {
  const ButtonWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(10),
      child: Wrap(
        children: [
          TextButton(
              onFocusChange: (val) {
                print('TextButton 聚焦变更触发 -> $val');
              },
              /* 进入 true 和离开 false 时触发 */
              onHover: (val) {
                print('TextButton 悬停触发 -> $val');
              },
              onPressed: () {
                print('TextButton 点击触发');
              },
              onLongPress: () {
                print('TextButton 长按触发');
              },
              child: const Text('TextButton 文本按钮')
          ),
          ElevatedButton(
              onFocusChange: (val) {
                print('ElevatedButton 聚焦变更触发 -> $val');
              },
              /* 进入 true 和离开 false 时触发 */
              onHover: (val) {
                print('ElevatedButton 悬停触发 -> $val');
              },
              onPressed: () {
                print('ElevatedButton 点击触发');
              },
              onLongPress: () {
                print('ElevatedButton 长按触发');
              },
              child: const Text('ElevatedButton 突起按钮')
          ),
          OutlinedButton(
              onFocusChange: (val) {
                print('OutlinedButton 聚焦变更触发 -> $val');
              },
              /* 进入 true 和离开 false 时触发 */
              onHover: (val) {
                print('OutlinedButton 悬停触发 -> $val');
              },
              onPressed: () {
                print('OutlinedButton 点击触发');
              },
              onLongPress: () {
                print('OutlinedButton 长按触发');
              },
              child: const Text('OutlinedButton 框线按钮')
          ),

          OutlinedButton(
              onPressed: () {},
              child: const Text('轮廓按钮'),
              style: ButtonStyle(
                textStyle: MaterialStateProperty.all(TextStyle(fontSize: 30)),
                /* 背景颜色 */
                backgroundColor: MaterialStateProperty.resolveWith((state) {
                  if (state.contains(MaterialState.pressed)) {
                    return Colors.red;
                  }
                  return Colors.blue;
                }),
                /* 字体颜色 */
                foregroundColor: MaterialStateProperty.resolveWith((state) {
                  return Colors.white;
                }),
                shadowColor: MaterialStateProperty.all(Colors.yellow),
                elevation: MaterialStateProperty.all(10),
                side: MaterialStateProperty.all(
                    const BorderSide(
                      color: Colors.black38,
                      width: 2
                    )
                ),
                /* 形状设置 */
                shape: MaterialStateProperty.all(
                  const StadiumBorder(
                    side: BorderSide(
                      color: Colors.green,
                      width: 2
                    )
                  )
                ),
                minimumSize: MaterialStateProperty.all(Size(150, 60)),
                maximumSize: MaterialStateProperty.all(Size(450, 300)),
                overlayColor: MaterialStateProperty.all(Colors.lightBlue)
              ),
          ),
        ],
      ),
    );
  }

}